<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8" %>
<%@ include file="/WEB-INF/common/taglibs.jsp" %>
<div class="main-content">
    <div class="main-content-inner">
        <%@include file="/WEB-INF/common/back/breadcrumb.jsp" %>
        <div class="page-content">
            <div class="row">
                <div class="col-xs-12">
                    <div class="widget-box ui-sortable-handle">
                        <div class="widget-header">
                            <h5 class="widget-title">分类树</h5>

                        </div>

                        <div class="widget-body">
                            <div class="widget-main">
                                <button class="btn btn-info btn-xs" type="button" onclick="showAddCategory('CATEGORY')">
                                    添加
                                </button>
                                <button class="btn btn-info btn-xs" type="button" onclick="showEditCategory('CATEGORY')">
                                    编辑
                                </button>
                                <button class="btn btn-info btn-xs" type="button" onclick="delCategory('CATEGORY')">
                                    删除
                                </button>
                                <button class="btn btn-info btn-xs" type="button" onclick="showtreeModal('CATEGORY')">
                                    转移
                                </button>
                                <ul id="categoryTree" class="ztree"></ul>
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            <div class="row">

            </div>
            <div class="clearfix form-actions">
                <div class="col-md-offset-3 col-md-9">
                    <button class="btn btn-grey" onclick="history.back()">
                        <i class="ace-icon fa fa-arrow-left bigger-110"></i>
                        返回
                    </button>
                </div>
            </div>
        </div>
    </div>
</div>

<div class="modal fade in" id="addCategoryModal" tabindex="-1" aria-hidden="false">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">×</span>
                </button>
                <h4 class="modal-title" id="modifyTitle">添加</h4>
            </div>
            <div class="modal-body">
                <form type="post" id="addCategoryForm" class="form-horizontal" action="${contextPath}/back/category/save">
                    <input type="hidden" id="parentId" name="parentId">
                    <input type="hidden" id="id" name="id">
                    <input type="hidden" id="categoryType" name="categoryType">
                    <div class="form-group">
                        <label class="col-sm-2 control-label no-padding-right"><b class="red">*</b> 名称 </label>
                        <div class="col-sm-6">
                            <input type="text" class="form-control" name="name">
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label no-padding-right"><b class="red">*</b> 序号 </label>
                        <div class="col-sm-6">
                            <input type="text" class="form-control" name="seq">
                        </div>
                    </div>
                </form>
            </div>
            <div class="modal-footer">
                <button type="button" onclick="saveCategory()" class="btn btn-primary">确定</button>
                <button type="button" data-dismiss="modal" class="btn btn-default">
                    <i class="ace-icon fa fa-times bigger-110"></i> 关闭
                </button>
            </div>
        </div>
    </div>
</div>
<%@include file="/WEB-INF/jsp/back/category/transTreeItem.jsp" %>
<script>
    var zTreeObj;
    var zTreeObjCategory;
    var setting = {};
    $.ajax({
        dataType: "json",
        url: "${contextPath}/back/category/categoryTree",
        type: "post",
        data: {categoryType: 'CATEGORY'},
        success: function (data) {
            zTreeObjCategory = $.fn.zTree.init($("#categoryTree"), setting, data);
        }
    });

    function initZTreeObj(type) {
        $("#categoryType").val(type);
        if (type == 'CATEGORY') {
            zTreeObj = zTreeObjCategory;
        }
    }

    function delCategory(type) {
        initZTreeObj(type);
        var nodes = zTreeObj.getSelectedNodes();
        if (G.isEmpty(nodes) || nodes.length > 1) {
            layer.msg("请选择一个树节点操作");
            return;
        }
        layer.confirm('确定删除？', {
            btn: ['确定', '取消'] //按钮
        }, function () {
            var node = nodes[0];
            $("#id").val("");
            $("#parentId").val(node.id);
            $.ajax({
                dataType: "json",
                url: "${contextPath}/back/category/del",
                type: "post",
                data: {ids: node.id, type: type},
                success: function (result) {
                    if (result.success) {
                        layer.closeAll('dialog');
                        zTreeObj.removeNode(nodes[0]);
                    } else {
                        layer.msg(result.msg);
                    }
                }
            });
        }, function () {

        });
    }


    function showAddCategory(type) {
        initZTreeObj(type);
        $('#addCategoryForm')[0].reset();
        var nodes = zTreeObj.getSelectedNodes();
        if (G.isEmpty(nodes) || nodes.length > 1) {
            layer.msg("请选择一个树节点操作");
            return;
        }
        var node = nodes[0];
        $("#id").val("");
        $("#parentId").val(node.id);
        $("#modifyTitle").html("添加");
        $("#addCategoryModal").modal("show");
    }

    function showEditCategory(type) {
        initZTreeObj(type);
        $('#addCategoryForm')[0].reset();
        var nodes = zTreeObj.getSelectedNodes();
        if (G.isEmpty(nodes) || nodes.length > 1) {
            layer.msg("请选择一个树节点操作");
            return;
        }
        var node = nodes[0];
        console.log(node);
        $.ajax({
            dataType: "json",
            url: "${contextPath}/back/category/info",
            type: "post",
            data: {id: node.id},
            success: function (result) {
                var category = result.data;
                $("input[name='id']").val(category.id);
                $("input[name='parentId']").val(category.parentId);
                $("input[name='name']").val(category.name);
                $("input[name='url']").val(category.url);
                $("input[name='seq']").val(category.seq);
                $("input[name='icon']").val(category.icon);
                $("#modifyTitle").html("编辑");
                $("#addCategoryModal").modal("show");
            }
        });
    }

    function saveCategory() {
        var ajax_option;
        if ("添加" == $("#modifyTitle").html()) {
            ajax_option = {
                url: "${contextPath}/back/category/save",//默认是form 
                success: function (result) {
                    if (result.success) {
                        $("#addCategoryModal").modal("hide");
                        var newNode = result.data;
                        zTreeObj.addNodes(zTreeObj.getSelectedNodes()[0], newNode);
                    }
                    else {
                        layer.msg(result.msg);
                    }
                }
            };
        } else {
            ajax_option = {
                url: "${contextPath}/back/category/save",//默认是form 
                success: function (result) {
                    if (result.success) {
                        $("#addCategoryModal").modal("hide");
                        var nodes = zTreeObj.getSelectedNodes();
                        var newNode = result.data;
                        nodes[0].name = newNode.name;
                        nodes[0].url = newNode.url;
                        zTreeObj.updateNode(nodes[0]);
                    }
                    else {
                        layer.msg(result.msg);
                    }
                }
            };
        }
        $('#addCategoryForm').ajaxSubmit(ajax_option);
    }

</script>